#main {
    /*高度*/
    height: 100%;
}

#main .divHead {
    /*背景图*/
    background: url(../images/mainBg.png);

    /*图像只显示一次*/
    background-repeat: no-repeat;

    /*高度*/
    height: 152rem;

    /*图片保持比例放大或缩小填充容器*/
    background-size: contain;
}

/*跳转用户页图片*/
#main .divHead img {
    /*绝对定位*/
    position: absolute;

    /*左边缘*/
    left: 19rem;

    /*下边缘*/
    top: 41rem;

    /*宽度*/
    width: 28rem;

    /*高度*/
    height: 28rem;
}

#main .divTitle {
    /*宽度*/
    width: 345rem;

    /*高度*/
    height: 118rem;

    /*透明度*/
    opacity: 1;

    /*背景色*/
    background: #ffffff;

    /*圆角*/
    border-radius: 6rem;

    /*阴影*/
    box-shadow: 0rem 2rem 5rem 0rem rgba(69, 69, 69, 0.1);

    /*绝对定位*/
    position: absolute;

    /*左边缘*/
    left: 50%;

    /*上边缘*/
    top: 77rem;

    /*延X轴和延Y轴均移动长的-50%和0像素*/
    transform: translate(-50%, 0);

    /*为元素设定的宽度和高度决定了元素的边框盒*/
    box-sizing: border-box;

    /*上右下左内边距*/
    padding: 14rem 0 0 8rem;
}

#main .divTitle .divStatic {
    /*弹性布局*/
    display: flex;
}

/*logo图片*/
#main .divTitle .divStatic .logo {
    /*宽度*/
    width: 39rem;

    /*高度*/
    height: 39rem;

    /*透明度*/
    opacity: 1;

    /*背景色*/
    background: #333333;

    /*圆角*/
    border-radius: 6rem;

    /*右外边距*/
    margin-right: 10rem;
}

/*餐厅名字*/
#main .divTitle .divStatic .divDesc .divName {
    /*宽度*/
    width: 90rem;

    /*高度*/
    height: 25rem;

    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 18rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #20232a;

    /*行高*/
    line-height: 25rem;
}

#main .divTitle .divStatic .divDesc .divSend {
    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 11rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 400;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #333333;

    /*下外边距*/
    margin-bottom: 10rem;
}

/*配送费，配送时间，配送距离图片*/
#main .divTitle .divStatic .divDesc .divSend img {
    /*宽度*/
    width: 14rem;

    /*高度*/
    height: 14rem;

    /*透明度*/
    opacity: 1;

    /*垂直对齐文本的下标*/
    vertical-align: sub;
}

/*配送费，配送时间，配送距离*/
#main .divTitle .divStatic .divDesc .divSend span {
    /*右外边距*/
    margin-right: 12rem;
}

/*配送时间*/
#main .divTitle .divStatic .divDesc .divSend span:last-child {
    /*右外边距*/
    margin-right: 0;
}

/*餐厅简介*/
#main .divTitle > .divDesc {
    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 12rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 400;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #9b9b9b;

    /*行高*/
    line-height: 17rem;

    /*右外边距*/
    margin-right: 18rem;

    /*上内边距*/
    padding-top: 9rem;

    /*上边框*/
    border-top: 1rem dashed #ebebeb;
}

#main .divBody {
    /*弹性布局*/
    display: flex;

    /*高度*/
    height: 100%;
}


#main .divBody .divType {
    /*背景色*/
    background: #f6f6f6;
}

#main .divBody .divType ul {
    /*上外边距*/
    margin-top: 61rem;

    /*表示自动出现滚动条*/
    overflow-y: auto;

    /*高度*/
    height: calc(100% - 61rem);

    /*下内边距*/
    padding-bottom: 200rem;

    /*为元素设定的宽度和高度决定了元素的边框盒*/
    box-sizing: border-box;

    /*宽度*/
    width: 84rem;

    /*透明度*/
    opacity: 1;
}

/*菜品和套餐的分类*/
#main .divBody .divType ul li {
    /*上右下左内边距*/
    padding: 16rem;

    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 13rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 400;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #666666;

    /*行高*/
    line-height: 18rem;

    /*字符间距*/
    letter-spacing: 0rem;

    /*一行剩下的空间放不下时，另起一行，新的行放不到再把单词断了*/
    word-wrap: break-word;

    /*使用默认的断行规则*/
    word-break: normal;
}

/*选择的菜品或套餐分类*/
#main .divBody .divType ul li.active {
    /*文本颜色*/
    color: #333333;

    /*字体粗细*/
    font-weight: 500;

    /*背景色*/
    background-color: #ffffff;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;
}

#main .divBody .divMenu {
    /*背景色*/
    background-color: #ffffff;

    /*为元素设定的宽度和高度决定了元素的边框盒*/
    box-sizing: border-box;

    /*宽度*/
    width: 100%;

    /*高度*/
    height: 100%;
}

#main .divBody .divMenu > div {
    /*下外边距*/
    margin-top: 61rem;

    /*表示自动出现滚动条*/
    overflow-y: auto;

    /*高度*/
    height: calc(100% - 61rem);

    /*下内边距*/
    padding-bottom: 200rem;

    /*为元素设定的宽度和高度决定了元素的边框盒*/
    box-sizing: border-box;
}

#main .divBody .divMenu .divItem {
    /*上右下左外边距*/
    margin: 10rem 15rem 20rem 14rem;

    /*弹性布局*/
    display: flex;
}

/*有菜品或套餐图片*/
#main .divBody .divMenu .divItem .el-image {
    /*宽度*/
    width: 86rem;

    /*高度*/
    height: 86rem;

    /*右外边距*/
    margin-right: 14rem;
}

/*无菜品或套餐图片*/
#main .divBody .divMenu .divItem .el-image img {
    /*宽度*/
    width: 86rem;

    /*高度*/
    height: 86rem;

    /*圆角*/
    border-radius: 5rem;
}

#main .divBody .divMenu .divItem > div {
    /*相对定位*/
    position: relative;
}

/*菜品或套餐名*/
#main .divBody .divMenu .divItem .divName {
    /*高度*/
    height: 22rem;

    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 16rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Semibold;

    /*字体粗细*/
    font-weight: 600;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 22rem;

    /*字符间距*/
    letter-spacing: 0;

    /*下外边距*/
    margin-bottom: 5rem;

    /*内容溢出的时候使它隐藏溢出的部分*/
    overflow: hidden;

    /*文本溢出内容显示为省略标记*/
    text-overflow: ellipsis;

    /*文本不会换行，文本会在在同一行上继续，直到遇到标签为止*/
    white-space: nowrap;

    /*宽度*/
    width: 175rem;
}

/*菜品或套餐描述和月销*/
#main .divBody .divMenu .divItem .divDesc {
    /*高度*/
    height: 16rem;

    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 12rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 400;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #666666;

    /*行高*/
    line-height: 16rem;

    /*字符间距*/
    letter-spacing: 0rem;

    /*下外边距*/
    margin-bottom: 4rem;

    /*内容溢出的时候隐藏溢出的部分*/
    overflow: hidden;

    /*文本溢出内容显示为省略标记*/
    text-overflow: ellipsis;

    /*文本不会换行，文本会在在同一行上继续，直到遇到标签为止*/
    white-space: nowrap;

    /*宽度*/
    width: 144rem;
}

/*价格*/
#main .divBody .divMenu .divItem .divBottom {
    /*字号*/
    font-size: 15rem;

    /*字体系列*/
    font-family: DIN, DIN-Medium;

    /*字体粗细*/
    font-weight: 500;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #e94e3c;

    /*行高*/
    line-height: 20rem;

    /*字符间距*/
    letter-spacing: 0rem;
}

/*价格符号*/
#main .divBody .divMenu .divItem .divBottom span:first-child {
    /*字号*/
    font-size: 12rem;
}

/*价格的数字*/
#main .divBody .divMenu .divItem .divBottom span:last-child {
    /*字号*/
    font-size: 15rem;
}

#main .divBody .divMenu .divItem .divNum {
    /*弹性布局*/
    display: flex;

    /*绝对位置*/
    position: absolute;

    /*右边缘*/
    right: 12rem;

    /*下边缘*/
    bottom: 0;
}

/*购物车中该商品或套餐的数量*/
#main .divBody .divMenu .divItem .divNum .divDishNum {
    /*字号*/
    font-size: 15rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本居中*/
    text-align: center;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 36rem;

    /*字符间距*/
    letter-spacing: 0;

    /*宽度*/
    width: auto;
}

/*选择规格按钮*/
#main .divBody .divMenu .divItem .divNum .divTypes {
    /*宽度*/
    width: 64rem;

    /*高度*/
    height: 24rem;

    /*透明度*/
    opacity: 1;

    /*背景色*/
    background: #ffc200;

    /*圆角*/
    border-radius: 12rem;

    /*字号*/
    font-size: 12rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本居中*/
    text-align: center;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 24rem;

    /*字符间距*/
    letter-spacing: 0;
}

/*菜品或套餐增加减少图片*/
#main .divBody .divMenu .divItem .divNum img {
    /*宽度*/
    width: 36rem;

    /*高度*/
    height: 36rem;
}


#main .divCart {
    /*宽度*/
    width: 345rem;

    /*高度*/
    height: 44rem;

    /*透明度*/
    opacity: 1;

    /*背景色*/
    background: #000000;

    /*圆角*/
    border-radius: 25rem;

    /*阴影*/
    box-shadow: 0rem 3rem 5rem 0rem rgba(0, 0, 0, 0.25);

    /*上下外边距为0，左右外边距auto*/
    margin: 0 auto;

    /*下边缘*/
    bottom: 24rem;

    /*生成绝对定位的元素， 相对于浏览器窗口进行定位*/
    position: fixed;

    /*左边缘*/
    left: 50%;

    /*延X轴和延Y轴均移动长的-50%和0像素*/
    transform: translate(-50%, 0);

    /*设置元素的堆叠顺序,值越大越靠上*/
    z-index: 3000;
}

/*购物车有商品时的图片*/
#main .divCart .imgCartActive {
    /*背景图*/
    background-image: url("./../images/cart_active.png");
}

/*购物车无商品时的图片*/
#main .divCart .imgCart {
    /*背景图*/
    background-image: url("./../images/cart.png");
}

/*购物车图片*/
#main .divCart > div:first-child {
    /*宽度*/
    width: 60rem;

    /*高度*/
    height: 60rem;

    /*绝对定位*/
    position: absolute;

    /*左边缘*/
    left: 11rem;

    /*下边缘*/
    bottom: 0;

    /*背景大小*/
    background-size: 60rem 60rem;
}

/*价格*/
#main .divCart .divNum {
    /*字号*/
    font-size: 12rem;

    /*字体系列*/
    font-family: DIN, DIN-Medium;

    /*字体粗细*/
    font-weight: 500;

    /*文本居中*/
    text-align: left;

    /*文本颜色*/
    color: #ffffff;

    /*字符间距*/
    letter-spacing: 0rem;

    /*绝对定位*/
    position: absolute;

    /*左边缘*/
    left: 92rem;

    /*上边缘*/
    top: 10rem;
}

/*价格的数字*/
#main .divCart .divNum span:last-child {
    /*字号*/
    font-size: 20rem;
}

/*去结算*/
#main .divCart > div:last-child {
    /*宽度*/
    width: 102rem;

    /*高度*/
    height: 36rem;

    /*透明度*/
    opacity: 1;

    /*圆角*/
    border-radius: 18rem;

    /*字号*/
    font-size: 15rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本居中*/
    text-align: center;

    /*行高*/
    line-height: 36rem;

    /*相对定位*/
    position: absolute;

    /*右边缘*/
    right: 5rem;

    /*上边缘*/
    top: 4rem;
}

/*购物车无商品时的去结算按钮*/
#main .divCart .btnSubmit {
    /*文本颜色*/
    color: white;

    /*背景色*/
    background: #d8d8d8;
}

/*购物车无商品时的去结算按钮*/
#main .divCart .btnSubmitActive {
    /*文本颜色*/
    color: #333333;

    /*背景色*/
    background: #ffc200;
}

/*购物车数量<=99*/
#main .divCart .divGoodsNum {
    /*宽度*/
    width: 18rem;

    /*高度*/
    height: 18rem;

    /*透明度*/
    opacity: 1;

    /*背景色*/
    background: #e94e3c;

    /*圆角*/
    border-radius: 50%;

    /*文本居左*/
    text-align: center;

    /*字号*/
    font-size: 12rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本颜色*/
    color: #ffffff;

    /*行高*/
    line-height: 18rem;

    /*绝对定位*/
    position: absolute;

    /*左边缘*/
    left: 50rem;

    /*下边缘*/
    top: -5rem;
}

/*购物车数量>99*/
#main .divCart .moreGoods {
    /*宽度*/
    width: 25rem;

    /*高度*/
    height: 25rem;

    /*行高*/
    line-height: 25rem;
}

/*选择规格弹出框*/
#main .dialogFlavor {
    /*透明度*/
    opacity: 1;

    /*背景色*/
    background: #ffffff;

    /*圆角*/
    border-radius: 10rem;
}

/*菜名*/
#main .dialogFlavor .dialogTitle {
    /*上外边距*/
    margin-top: 26rem;

    /*下外边距*/
    margin-bottom: 14rem;

    /*字号*/
    font-size: 18rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本颜色*/
    color: #333333;

    /*字符间距*/
    letter-spacing: 0;

    /*文本居中*/
    text-align: center;
}

#main .dialogFlavor .divContent {
    /*左外边距*/
    margin-left: 15rem;

    /*右外边距*/
    margin-right: 15rem;
}

/*口味维度名*/
#main .dialogFlavor .divContent .divFlavorTitle {
    /*高度*/
    height: 20rem;

    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 14rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 400;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #666666;

    /*行高*/
    line-height: 20rem;

    /*字符间距*/
    letter-spacing: 0;

    /*左外边距*/
    margin-left: 5rem;

    /*下外边距*/
    margin-bottom: 10rem;

    /*上外边距*/
    margin-top: 10rem;
}

/*口味名*/
#main .dialogFlavor .divContent span {
    /*显示为行内块状元素*/
    display: inline-block;

    /*高度*/
    height: 30rem;

    /*透明度*/
    opacity: 1;

    /*背景色*/
    background: #ffffff;

    /*边框*/
    border: 1rem solid #ffc200;

    /*圆角*/
    border-radius: 7rem;

    /*行高*/
    line-height: 30rem;

    /*左内边距*/
    padding-left: 13rem;

    /*右内边距*/
    padding-right: 13rem;

    /*上右下左外边距*/
    margin: 0 5rem 10rem 5rem;

    /*字号*/
    font-size: 14rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 400;

    /*文本居中*/
    text-align: center;

    /*文本颜色*/
    color: #333333;
}

/*选择的口味标签*/
#main .dialogFlavor .divContent .spanActive {
    /*背景色*/
    background: #ffc200;

    /*字体粗细*/
    font-weight: 500;
}

#main .dialogFlavor .divBottom {
    /*上外边距*/
    margin-top: 20rem;

    /*下外边距*/
    margin-bottom: 19rem;

    /*左外边距*/
    margin-left: 20rem;

    /*弹性布局*/
    display: flex;

    /*相对定位*/
    position: relative;
}

/*价格*/
#main .dialogFlavor .divBottom div:first-child {
    /*高度*/
    height: 30rem;

    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 20rem;

    /*字体系列*/
    font-family: DIN, DIN-Medium;

    /*字体粗细*/
    font-weight: 500;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #e94e3c;

    /*行高*/
    line-height: 30rem;

    /*字符间距*/
    letter-spacing: 0;
}

/*价格符号*/
#main .dialogFlavor .divBottom div span {
    /*字号*/
    font-size: 14rem;
}

/*加入购物车*/
#main .dialogFlavor .divBottom div:last-child {
    /*宽度*/
    width: 100rem;

    /*高度*/
    height: 30rem;

    /*透明度*/
    opacity: 1;

    /*背景色*/
    background: #ffc200;

    /*圆角*/
    border-radius: 15rem;

    /*行高*/
    line-height: 30rem;

    /*绝对定位*/
    position: absolute;

    /*右边缘*/
    right: 20rem;

    /*字号*/
    font-size: 14rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本居中*/
    text-align: center;

    /*文本颜色*/
    color: #333333;
}

/*X按钮退出*/
#main .dialogFlavor .divFlavorClose {
    /*绝对定位*/
    position: absolute;

    /*下边缘*/
    bottom: -70rem;

    /*左边缘*/
    left: 50%;

    /*延X轴和延Y轴均移动长的-50%和0像素*/
    transform: translate(-50%, 0);
}

/*X的图片*/
#main .dialogFlavor .divFlavorClose img {
    /*宽度*/
    width: 44rem;

    /*高度*/
    height: 44rem;
}

#main .dialogCart {
    /*背景色*/
    background: linear-gradient(180deg, #ffffff 0%, #ffffff 81%);

    /*圆角*/
    border-radius: 12px 12px 0px 0px;
}

#main .dialogCart .divCartTitle {
    /*高度*/
    height: 59rem;

    /*弹性布局*/
    display: flex;

    /*行高*/
    line-height: 60rem;

    /*相对定位*/
    position: relative;

    /*左外边距*/
    margin-left: 15rem;

    /*右外边距*/
    margin-right: 10rem;

    /*下边框*/
    border-bottom: 1px solid #efefef;
}

/*标题*/
#main .dialogCart .divCartTitle .title {
    /*字号*/
    font-size: 20rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Semibold;

    /*字体粗细*/
    font-weight: 600;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #333333;
}

/*清空购物车*/
#main .dialogCart .divCartTitle .clear {
    /*绝对定位*/
    position: absolute;

    /*右边缘*/
    right: 0;

    /*上边缘*/
    top: 50%;

    /*延X轴和延Y轴均移动0像素和宽的-50%*/
    transform: translate(0, -50%);

    /*文本颜色*/
    color: #999999;

    /*字号*/
    font-size: 14px;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 400;

    /*文本居左*/
    text-align: left;
}

#main .dialogCart .divCartItem {
    /*高度*/
    height: 108rem;

    /*左外边距*/
    margin-left: 15rem;

    /*右外边距*/
    margin-right: 10rem;

    /*弹性布局*/
    display: flex;

    /*设置子元素居中*/
    align-items: center;

    /*相对定位*/
    position: relative;
}

#main .dialogCart .divCartContent {
    /*高度*/
    height: calc(100% - 130rem);

    /*表示自动出现滚动条*/
    overflow-y: auto;
}

/*有菜品图片*/
#main .dialogCart .divCartContent .el-image {
    /*宽度*/
    width: 64rem;

    /*高度*/
    height: 64rem;

    /*透明度*/
    opacity: 1;

    /*右外边距*/
    margin-right: 10rem;
}

/*无菜品图片*/
#main .dialogCart .divCartContent .el-image img {
    /*宽度*/
    width: 64rem;
    /*高度*/
    height: 64rem;
}

/*菜名*/
#main .dialogCart .divCartContent .divDesc .name {
    /*高度*/
    height: 22rem;

    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 16rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Semibold;

    /*字体粗细*/
    font-weight: 600;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 22rem;

    /*字符间距*/
    letter-spacing: 0;

    /*下外边距*/
    margin-bottom: 17rem;
}

/*价格*/
#main .dialogCart .divCartContent .divDesc .price {
    /*字号*/
    font-size: 18rem;

    /*字体系列*/
    font-family: DIN, DIN-Medium;

    /*字体粗细*/
    font-weight: 500;

    /*文件居左*/
    text-align: left;

    /*文本颜色*/
    color: #e94e3c;
}

/*价格的符号*/
#main .dialogCart .divCartContent .divDesc .price .spanMoney {
    /*字号*/
    font-size: 12rem;
}


#main .dialogCart .divCartContent .divCartItem .divNum {
    /*绝对定位*/
    position: absolute;

    /*右边缘*/
    right: 0;

    /*下边缘*/
    bottom: 10rem;

    /*弹性布局*/
    display: flex;

    /*行高*/
    line-height: 36rem;

    /*高度*/
    height: 36rem;
}

/*购物车中添加或减少商品*/
#main .dialogCart .divCartContent .divCartItem .divNum img {
    /*宽度*/
    width: 36rem;

    /*高度*/
    height: 36rem;
}

/*分割线*/
#main .dialogCart .divCartContent .divCartItem .divSplit {
    /*宽度*/
    width: calc(100% - 64rem);

    /*绝对定位*/
    position: absolute;

    /*下边缘*/
    bottom: 0;

    /*右边缘*/
    right: 0;

    /*高度*/
    height: 1px;

    /*透明度*/
    opacity: 1;

    /*背景色*/
    background-color: #efefef;
}

#main .detailsDialog {
    /*弹性布局*/
    display: flex;

    /*盒布局,并且该布局内部的子控件排列方式是纵向排列,即从上往下*/
    flex-direction: column;

    /*文本居中*/
    text-align: center;
}

#main .detailsDialog .divContainer {
    /*上右下左内边距*/
    padding: 20rem 20rem 0 20rem;

    /*最大高度*/
    max-height: 50vh;

    /*表示自动出现滚动条*/
    overflow-y: auto;
}

/*有菜品或套餐图片*/
#main .detailsDialog .el-image {
    /*宽度*/
    width: 100%;

    /*高度*/
    height: 100%;
}

/*无菜品或套餐图片*/
#main .detailsDialog .el-image img {
    /*宽度*/
    width: 100%;

    /*高度*/
    height: 100%;
}

/*菜名或套餐名*/
#main .detailsDialog .title {
    /*高度*/
    height: 28rem;

    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 20rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Semibold;

    /*字体粗细*/
    font-weight: 600;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 28rem;

    /*字符间距*/
    letter-spacing: 0;

    /*上外边距*/
    margin-top: 18rem;

    /*下外边距*/
    margin-bottom: 11rem;

    /*内容溢出的时候隐藏溢出的部分*/
    overflow: hidden;

    /*文本溢出内容显示为省略标记*/
    text-overflow: ellipsis;

    /*文本不会换行，文本会在在同一行上继续，直到遇到标签为止*/
    white-space: nowrap;

    /*宽度*/
    width: 100%;
}

/*菜品或套餐的描述信息*/
#main .detailsDialog .content {
    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 14rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 400;

    /*每一行被展开为宽度相等，左，右外边距是对齐*/
    text-align: justify;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 24rem;
}

#main .detailsDialog .divNum {
    /*弹性布局*/
    display: flex;

    /*两端对齐,项目之间的间隔都相等 */
    justify-content: space-between;

    /*上外边距*/
    margin-top: 23rem;

    /*下外边距*/
    margin-bottom: 20rem;

    /*左内边距*/
    padding-left: 20rem;

    /*右内边距*/
    padding-right: 20rem;
}

/*价格*/
#main .detailsDialog .divNum .left {
    /*字号*/
    font-size: 20rem;

    /*字体系列*/
    font-family: DIN, DIN-Medium;

    /*字体粗细*/
    font-weight: 500;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #e94e3c;

    /*行高*/
    line-height: 36rem;

    /*字符间距*/
    letter-spacing: 0rem;
}

/*价格的符号*/
#main .detailsDialog .divNum .left span:first-child {
    /*字号*/
    font-size: 12rem;
}

#main .detailsDialog .divNum .right {
    /*弹性布局*/
    display: flex;
}

/*该菜品或套餐在购物车中的数量*/
#main .detailsDialog .divNum .divDishNum {
    /*字号*/
    font-size: 15rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本居中*/
    text-align: center;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 36rem;

    /*字符间距*/
    letter-spacing: 0;

    /*宽度*/
    width: auto;
}

/*选择规格*/
#main .detailsDialog .divNum .divTypes {
    /*宽度*/
    width: 64rem;

    /*高度*/
    height: 24rem;

    /*透明度*/
    opacity: 1;

    /*背景色*/
    background: #ffc200;

    /*圆角*/
    border-radius: 12rem;

    /*字号*/
    font-size: 12rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本居中*/
    text-align: center;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 24rem;

    /*字符间距*/
    letter-spacing: 0;
}

/*增加和减少按钮*/
#main .detailsDialog .divNum .divSubtract,.divAdd {
    /*高度*/
    height: 36rem;
}

/*增加和减少按钮图片*/
#main .detailsDialog .divNum img {
    /*宽度*/
    width: 36rem;

    /*高度*/
    height: 36rem;
}

/*X按钮*/
#main .detailsDialog .detailsDialogClose {
    /*绝对定位*/
    position: absolute;

    /*下边缘*/
    bottom: -70rem;

    /*左边缘*/
    left: 50%;

    /*延X轴和延Y轴均移动长的-50%和0像素*/
    transform: translate(-50%, 0);
}

/*X的图片*/
#main .detailsDialog .detailsDialogClose img {
    /*宽度*/
    width: 44rem;

    /*高度*/
    height: 44rem;
}

#main .setMealDetailsDialog {
    /*弹性布局*/
    display: flex;

    /*盒布局,并且该布局内部的子控件排列方式是纵向排列,即从上往下*/
    flex-direction: column;

    /*文本居中*/
    text-align: center;
}

#main .setMealDetailsDialog .divContainer {
    /*上右下左内边距*/
    padding: 20rem 20rem 0 20rem;

    /*最大高度*/
    max-height: 50vh;

    /*表示自动出现滚动条*/
    overflow-y: auto;
}

/*套餐内的菜品有图片*/
#main .setMealDetailsDialog .el-image {
    /*宽度*/
    width: 100%;

    /*高度*/
    height: 100%;
}

/*套餐内的菜品有图片*/
#main .setMealDetailsDialog .el-image img {
    /*宽度*/
    width: 100%;

    /*高度*/
    height: 100%;
}

#main .setMealDetailsDialog .divSubTitle {
    /*文本居左*/
    text-align: left;

    /*上外边距*/
    margin-top: 16rem;

    /*下外边距*/
    margin-bottom: 6rem;

    /*高度*/
    height: 25rem;

    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 18rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 25rem;

    /*字符间距*/
    letter-spacing: 0px;

    /*相对定位*/
    position: relative;
}

/*菜品价格*/
#main .setMealDetailsDialog .divContainer .item .divSubTitle .divPrice {
    /*绝对定位*/
    position: absolute;

    /*右边缘*/
    right: 0;

    /*上边缘*/
    top: 0;

    /*字号*/
    font-size: 18rem;

    /*字体系列*/
    font-family: DIN, DIN-Medium;

    /*字体粗细*/
    font-weight: 500;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #e94e3c;

    /*行高*/
    line-height: 25rem;

    /*字符间距*/
    letter-spacing: 0rem;
}

/*价格的符号*/
#main .setMealDetailsDialog .divContainer .item .divSubTitle .divPrice span:first-child {
    /*字号*/
    font-size: 12rem;
}

/*套餐名*/
#main .setMealDetailsDialog .title {
    /*高度*/
    height: 28rem;

    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 20rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Semibold;

    /*字体粗细*/
    font-weight: 600;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 28rem;

    /*字符间距*/
    letter-spacing: 0;

    /*上外边距*/
    margin-top: 18rem;

    /*下外边距*/
    margin-bottom: 11rem;
}

/*菜品描述*/
#main .setMealDetailsDialog .content {
    /*透明度*/
    opacity: 1;

    /*字号*/
    font-size: 14rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 400;

    /*每一行被展开为宽度相等，左，右外边距是对齐*/
    text-align: justify;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 24rem;
}

#main .setMealDetailsDialog .divNum {
    /*弹性布局*/
    display: flex;

    /*两端对齐,项目之间的间隔都相等 */
    justify-content: space-between;

    /*上外边距*/
    margin-top: 23rem;

    /*下内边距*/
    padding-bottom: 15rem;

    /*左内边距*/
    padding-left: 20rem;

    /*右内边距*/
    padding-right: 20rem;
}

/*套餐价格*/
#main .setMealDetailsDialog .divNum .left {
    /*字号*/
    font-size: 20rem;

    /*字体系列*/
    font-family: DIN, DIN-Medium;

    /*字体粗细*/
    font-weight: 500;

    /*文本居左*/
    text-align: left;

    /*文本颜色*/
    color: #e94e3c;

    /*行高*/
    line-height: 36rem;

    /*字符间距*/
    letter-spacing: 0rem;
}

/*价格的符号*/
#main .setMealDetailsDialog .divNum .left span:first-child {
    /*字号*/
    font-size: 12rem;
}

#main .setMealDetailsDialog .divNum .right {
    /*弹性布局*/
    display: flex;
}

/*套餐在购物车中的数量*/
#main .setMealDetailsDialog .divNum .divDishNum {
    /*字号*/
    font-size: 15rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本居中*/
    text-align: center;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 36rem;

    /*字符间距*/
    letter-spacing: 0;

    /*宽度*/
    width: auto;
}

/*增加减少按钮*/
#main .setMealDetailsDialog .divNum .divSubtract,.divAdd {
    /*高度*/
    height: 36rem;
}

/*增加减少按钮图片*/
#main .setMealDetailsDialog .divNum img {
    /*宽度*/
    width: 36rem;

    /*高度*/
    height: 36rem;
}

/*加入购物车*/
#main .setMealDetailsDialog .divNum .right .addCart {
    /*宽度*/
    width: 100rem;

    /*高度*/
    height: 30rem;

    /*透明度*/
    opacity: 1;

    /*背景色*/
    background: #ffc200;

    /*圆角*/
    border-radius: 15rem;

    /*字号*/
    font-size: 14rem;

    /*字体系列*/
    font-family: PingFangSC, PingFangSC-Regular;

    /*字体粗细*/
    font-weight: 500;

    /*文本居中*/
    text-align: center;

    /*文本颜色*/
    color: #333333;

    /*行高*/
    line-height: 30rem;
}

/*X按钮*/
#main .setMealDetailsDialog .detailsDialogClose {
    /*绝对定位*/
    position: absolute;

    /*下边缘*/
    bottom: -70rem;

    /*左边缘*/
    left: 50%;

    /*延X轴和延Y轴均移动长的-50%和0像素*/
    transform: translate(-50%, 0);
}

/*X按钮图片*/
#main .setMealDetailsDialog .detailsDialogClose img {
    /*宽度*/
    width: 44rem;

    /*高度*/
    height: 44rem;
}
